

{% if section  and section.type == "footer" %}
{% assign section = section %}
{% else %}
{% assign section = global.sections.footer %}
{% endif %}

{% stylesheet %}
	#footer_box{
		background: var(--footer-bg-color);
		color: var(--footer-font-color);
        position: relative;
        padding: 80px 0 0;
	}
    #footer_box .footer_link{
        display: flex;
        justify-content: space-between;
    }
    #footer_box .footer_link dl dt{
        color: var(--footer-dt-color);
        font-size: 20px;
        margin-bottom: 20px;
        line-height: 30px;
    }
    #footer_box .footer_link dl.footer_con dt a{
        font-size:30px;
        line-height:30px;
        text-decoration: none;
        color:var(--footer-dt-color);
    }
    #footer_box .footer_link dl.footer_con dt a img{
        max-height: 30px;
        max-width: 100%;
    }
    
    #footer_box .copyright{
        border-top:1px solid #e5e5e5;
        padding:20px 0;
        text-align: center;
        margin-top:50px;
    }
    #footer_box .footer_link a{
        display: block;
        line-height: 2;
        color: var(--footer-font-color);
    }
    #footer_box .footer_link a:hover{
        text-decoration: underline;
    }
    #footer_box .share_link{}
    #footer_box .share_link a{
        display: flex;
        line-height: 2;
        align-items: center;
    }
    #footer_box .share_link a svg{
        width: 20px;
        margin-right: 5px;
    }
    #footer_box .share_link a span{}
    @media screen and (max-width: 767px) {
        #footer_box .footer_wrapper{
            flex-direction: column;
            text-align: center;
        }
        #footer_box .copyright, #footer_box .footer_link{
            width: 100%;
        }
        #footer_box .footer_link{
            flex-wrap: wrap;
        }
        #footer_box .footer_link dl{
            width:100%;
            margin-bottom:50px;
        }
        #footer_box .share_link{
            margin-top: 20px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        #footer_box .copyright{
            margin-top: 20px;
            text-align: center;
        }
    }
    
{% endstylesheet %}
<div id="footer_box" style="--footer-bg-color:{{section.settings.bg-color}};--footer-font-color:{{section.settings.font-color}};--footer-dt-color:{{section.settings.dt-font-color}}" class="footer_box">
	<div class="footer_wrapper container_wrapper">
		<div class="footer_link">
            <dl class="footer_nav">
                {% if section.settings.nav_title_1 != '' %}<dt>{{section.settings.nav_title_1}}</dt>{% endif %}

                {% if section.settings.nav1.id %}
                {% get_nav nav_id={section.settings.nav1.id} %}                
                {% for item in nav.nav_item %}
                <dd>{% include "nav_a", nav : item  %}</dd>
                {% endfor %}
                {% else %}
                <dd><a href="javascript:void(0)">Orders</a></dd>
                <dd><a href="javascript:void(0)">Products</a></dd>
                <dd><a href="javascript:void(0)">Our Company</a></dd>
                {% endif %}
            </dl>
            <dl class="footer_nav">
                {% if section.settings.nav_title_2 != '' %}<dt>{{section.settings.nav_title_2}}</dt>{% endif %}
                {% if section.settings.nav2.id %}
                {% get_nav nav_id={section.settings.nav2.id} %}
                {% for item in nav.nav_item %}
                <dd>{% include "nav_a", nav : item  %}</dd>
                {% endfor %}
                {% else %}
                <dd><a href="javascript:void(0)">Orders</a></dd>
                <dd><a href="javascript:void(0)">Products</a></dd>
                <dd><a href="javascript:void(0)">Our Company</a></dd>
                {% endif %}
            </dl>
			<dl class="footer_con">
                <dt>
                    <a href="/">
                        {% if section.settings.footer_logo_pic.src %}
                        <img src="{{ section.settings.footer_logo_pic.src  | image_url:'600x600' }}" alt="{{ section.settings.footer_logo_pic.alt}}">
                        {% else %} 
                        {{ storeConfig.name }}
                        {% endif %}
                    </a>
                </dt>
                <dd>{{section.settings.footer_content}}</dd>         
            </dl>
		</div>
		
	</div>
    <div class="copyright">{{section.settings.copyright}}</div>
</div>

{% schema %}
{
    "tag": "footer",
    "class": "footer",
    "is_global": true,
    "name": {
        "zh_CN": "底部"
    },
    "max_blocks": "0",
    "settings": [
        {
            "type": "card_header",
            "label": {
                "zh_CN": "菜单1导航设置"
            }
        },
        {
            "type": "card_input",
            "id": "nav_title_1",
            "label": {
                "zh_CN": "菜单1标题"
            },
            "placeholder": {
                "zh_CN": "请输入标题"
            }
        },
        {
            "type": "card_nav",
            "label": {
                "zh_CN": "选择菜单1"
            },
            "id": "nav1"
        },
        {
            "type": "card_header",
            "label": {
                "zh_CN": "菜单2导航设置"
            }
        },
        {
            "type": "card_input",
            "id": "nav_title_2",
            "label": {
                "zh_CN": "菜单2标题"
            },
            "placeholder": {
                "zh_CN": "请输入标题"
            }
        },
        {
            "type": "card_nav",
            "label": {
                "zh_CN": "选择菜单2"
            },
            "id": "nav2"
        },
        {
            "type": "card_header",
            "label": {
                "zh_CN": "底部logo图片"
            }
        },
        {
            "type": "card_image",
            "label": {
                "zh_CN": "底部logo图片"
            },
            "id": "footer_logo_pic"
        },
        {
            "type": "card_text_editor",
            "label": {
                "zh_CN": "文本编辑"
            },
            "id": "footer_content"
        },
        {
            "type": "card_header",
            "label": {
                "zh_CN": "设置"
            }
        },
        {
            "type": "card_color",
            "label": {
                "zh_CN": "背景颜色"
            },
            "id": "bg-color"
        },
        {
            "type": "card_color",
            "label": {
                "zh_CN": "字体颜色"
            },
            "id": "font-color"
        },
        {
            "type": "card_color",
            "label": {
                "zh_CN": "表头颜色"
            },
            "id": "dt-font-color"
        },
        {
            "type": "card_text_editor",
            "label": {
                "zh_CN": "底部版权"
            },
            "id": "copyright"
        }
    ],
    "blocks": [],
    "default": {
        "settings": {
            "nav_title_1":"About us",
            "settings": {
                "nav1": {
                    "id": "",
                    "title": ""
                }
            },
            "nav_title_2":"Support",
            "settings": {
                "nav2": {
                    "id": "",
                    "title": ""
                }
            },
            "footer_logo_pic":"",
            "footer_content":"Use this text to share brand information with customers.",
            "bg-color": "#FFF8F4",
            "font-color": "#666666",
            "dt-font-color": "#111111",
            "copyright": "SHOP INC. All Rights Reserved."
        },
        "blocks": []
    }
}
{% endschema %}